import { useMantineColorScheme } from '@mantine/core';

/* eslint-disable max-len */
export const InAppHeaderIcons = (props) => {
  const { colorScheme } = useMantineColorScheme();
  const isDark = colorScheme === 'dark';

  return (
    <svg xmlns="http://www.w3.org/2000/svg" width="96" height="24" fill="none" viewBox="0 0 96 24">
      <mask
        id="mask0_174_182126"
        style={{ maskType: 'alpha' }}
        width="20"
        height="20"
        x="0"
        y="2"
        maskUnits="userSpaceOnUse"
      >
        <path fill="#D9D9D9" d="M0 2H20V22H0z"></path>
      </mask>
      <g mask="url(#mask0_174_182126)">
        <path
          fill="#828299"
          d="M11.065 21a7.789 7.789 0 01-3.144-.639 8.208 8.208 0 01-2.555-1.727 8.207 8.207 0 01-1.727-2.555A7.79 7.79 0 013 12.935c0-1.943.611-3.66 1.833-5.154C6.056 6.288 7.64 5.361 9.583 5c-.236 1.375-.156 2.68.24 3.917.396 1.236 1.073 2.333 2.031 3.291a7.85 7.85 0 003.292 1.98 8.05 8.05 0 003.854.229c-.333 1.916-1.253 3.493-2.76 4.729C14.733 20.382 13.008 21 11.065 21z"
        ></path>
      </g>
      <mask
        id="mask1_174_182126"
        style={{ maskType: 'alpha' }}
        width="20"
        height="20"
        x="36"
        y="2"
        maskUnits="userSpaceOnUse"
      >
        <path fill="#D9D9D9" d="M36 2H56V22H36z"></path>
      </mask>
      <g mask="url(#mask1_174_182126)">
        <path
          fill="#828299"
          d="M40 17.5V16h1v-5c0-1.208.371-2.27 1.115-3.188.743-.916 1.704-1.486 2.885-1.708V5c0-.278.097-.514.292-.708A.964.964 0 0146 4c.278 0 .514.097.708.292.195.194.292.43.292.708v1.104c1.18.222 2.142.792 2.885 1.708C50.63 8.73 51 9.793 51 11v5h1v1.5H40zm5.996 2.5c-.414 0-.767-.147-1.059-.44a1.45 1.45 0 01-.437-1.06h3c0 .417-.147.77-.442 1.063a1.456 1.456 0 01-1.062.437z"
        ></path>
      </g>
      <path
        fill={isDark ? '#3D3D4D' : '#EDF0F2'}
        d="M96 12c0 6.627-5.373 12-12 12s-12-5.373-12-12S77.373 0 84 0s12 5.373 12 12z"
      ></path>
      <path
        fill="#828299"
        d="M76.2 21.12v-2.537c0-.61.154-1.145.462-1.604a3 3 0 011.205-1.046 17.323 17.323 0 013.191-1.137 13.248 13.248 0 013.142-.38c1.056 0 2.1.13 3.133.388 1.034.258 2.095.635 3.184 1.13.505.238.912.587 1.22 1.045.309.459.463.993.463 1.604v2.178A11.958 11.958 0 0184 24a11.953 11.953 0 01-7.8-2.88zM81.458 11.975c.728.728 1.642 1.092 2.742 1.092s2.014-.364 2.742-1.092c.727-.728 1.091-1.642 1.091-2.742s-.364-2.014-1.091-2.741C86.214 5.764 85.3 5.4 84.2 5.4s-2.014.364-2.742 1.092c-.727.727-1.091 1.641-1.091 2.741s.364 2.014 1.091 2.742z"
      ></path>
      <rect width="10.6" height="10.6" x="48.7" y="2.7" fill="url(#paint0_linear_174_182126)" rx="5.3"></rect>
      <rect
        width="10.6"
        height="10.6"
        x="48.7"
        y="2.7"
        stroke={isDark ? '#292933' : '#EDF0F2'}
        strokeWidth="1.4"
        rx="5.3"
      ></rect>
      <path
        fill="#fff"
        d="M55.82 10.26V11h-3.2v-.74h1.172V6.888c0-.133.004-.27.012-.412l-.832.696a.366.366 0 01-.144.072.366.366 0 01-.24-.04.254.254 0 01-.072-.068l-.312-.428 1.764-1.5h.812v5.052h1.04z"
      ></path>
      <defs>
        <linearGradient id="paint0_linear_174_182126" x1="48" x2="60" y1="8" y2="8" gradientUnits="userSpaceOnUse">
          <stop stopColor="#DD2476"></stop>
          <stop offset="1" stopColor="#FF512F"></stop>
        </linearGradient>
      </defs>
    </svg>
  );
};
